<!--
	讨论卡片
	author yjl
 -->
<template>
	<view
		class="forum-card"
		@click="$emit('click',forum)"
	>
		<aha-avatar
			:src="forum.authorInfo.avatarUrl"
			circle
			size="40"
		/>
		<view class="right">
			<view class="head">
				<view class="name">{{forum.authorInfo.nickname}}</view>
				<view class="time">{{gformatDate(forum.createTime)}}</view>
			</view>
			<view class="content">
				{{forum.title}}
			</view>
			<view class="footer">
				<view style="flex: 1;" />
				<!-- 阅读数 -->
				<view class="data">
					<text class="iconfont icon-readed" />{{forum.read}}
				</view>
				<!-- 收藏量 -->
				<view class="data">
					<text class="iconfont icon-shoucang" />{{forum.collections}}
				</view>
				<!-- 点赞数 -->
				<view class="data">
					<text class="iconfont icon-zan" />{{forum.likes}}
				</view>
				<!-- 评论数 -->
				<view class="data">
					<text class="iconfont icon-pinglun" />{{forum.commentNum}}
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
  props: {
    forum: {
      type: Object,
      default: () => {}
    }
  }
}
</script>

<style lang="scss" scoped>
.forum-card {
  display: flex;
  padding: 10px;

  .right {
    flex: 1;
    margin-left: 10px;

    .head {
      display: flex;
      justify-content: space-between;

      .name {
        color: $dark2;
      }

      .time {
        font-size: 20rpx;
        color: $gray2;
      }
    }

    .content {
      padding: 5px 0;
      font-weight: 700;
      color: $dark2;
    }
  }

  .footer {
    display: flex;
    font-size: 24rpx;

    .data {
      margin-left: 10px;
    }

    .iconfont {
      margin-right: 2px;
      font-size: 24rpx;
    }
  }
}
</style>
